<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" />
<script src="/webjars/jquery/3.1.1/jquery.min.js"></script>
<script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script>

<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1 >文件上传</h1>
<div>
    <form>
        <input id = "file"  type="file"   name = "file"/>
        <input id = "upload" type="button" style="padding-bottom: 10px;margin-bottom: ">上传</input>
    </form>
</div>

</body>
<script>
    $("#upload").on("click",function(){
        FileUpload();
    });

    function FileUpload(){

        var fileName = $("#file").val();
        console.log(fileName);
        var formData = new FormData();
        formData.append("files",$("#file")[0].files[0]);
        var filesuffix = fileName.substr(fileName.lastIndexOf(".")+1);
        if(fileName == null || fileName == "" || fileName==undefined){
            alert("请上传文件")
            return;
        }
        if("txt" != filesuffix){
            alert("文件类型错误");
            return;
        }
        $.ajax({
            type:"POST",
            url:"/upload/getFileToByte",
            data:formData,
            dataType:"json",
            mimeType:"multipart/form-data",
            cache:false,
            processData:false,
            contentType:false,
            success:function(data){
                if(data.result){
                    alert("导入成功");
                }else{
                    alert("导入失败["+data.msg+"]");
                }
            }
        });
    }

</script>
</html>